<#include "/tags/DDMMYYYY.ftl">
<#include "/tags/userAvatar.ftl">
<#include "/tags/likeTag.ftl">
<#include "/tags/likeListTag.ftl">
<#include "/tags/cheerTag.ftl">
<#include "/tags/updatedSinceTag.ftl">
<#include "/tags/commentPackageTag.ftl">

<#macro viewHowIDone title goalId goalTitle youLikeThis likeCount cheerCount 
				 ownerName experience tookType tookAmount imgURL solution 
				 tip resources entryId cheerCount commentCount entryUpdatedSince
				 createdDate createdMonth createdYear goalCreatedDate comments
				 ownerAvatar="${rc.contextPath}/images/avatar.png">
	
	<span class="avatar">
		<@userAvatar username=ownerName avatar=ownerAvatar imgHeight="74" imgWidth="74"/>
	</span>	
	<div class="goalEntryContainer">
	<div class="entryPostTitle" style="padding-top:0px">
		<span class="goalEntryName"><b>Mục tiêu:</b> <a href="${rc.contextPath}/goal/view/${goalId}">${goalTitle}</a></span>
        <label>${rc.getMessage("page.dashboard.goal")}: <b>${goalCreatedDate}</b> </label>
    </div>
	<p class="userPostIt">Gửi bởi: <a href="/${ownerName}">${ownerName}</a></p>
    <div class="entryContentEditor">
    	<p class="quoteEntry"><b>&ldquo;</b>${experience}<b>&rdquo;</b></p>
        <p class="timeDoIt">
            <span class="icon"></span>
            <#assign iTookType=rc.getMessage("igoal.common.date")/>
			<#if (tookType == "WEEK")>
				<#assign iTookType=rc.getMessage("igoal.common.week")/>
			<#elseif (tookType == "MONTH")>
				<#assign iTookType=rc.getMessage("igoal.common.month")/>
			<#elseif (tookType == "YEAR")>
				<#assign iTookType=rc.getMessage("igoal.common.year")/>
			</#if>
            <span>Mất <b> ${tookAmount} ${iTookType} </b> để thực hiện mục tiêu này</span> 
		</p>
        <p class="howDidIt">
            <span class="icon"></span>
            <span>Thành viên <a href="${rc.contextPath}/${ownerName}"> ${ownerName} </a> đã thực hiện nó như thế nào</span> 
        </p>
    	<h1><a href="/done/view/${entryId}">${title}</a></h1>
    	<div class="">			
			<div class="ppy" id="ppy1">        
		        <ul class="ppy-imglist">
		            <li>
						<a href="${imgURL}" class="entryDashboard">
		                    <img src="${imgURL}" alt="${ownerName}" />
		                </a>
		            </li>
		        </ul>
		        <div class="ppy-outer">
		            <div class="ppy-stage">
		                <div class="ppy-nav">
		                    <a class="ppy-prev" title="Hình trước">Hình trước</a>
		                    <a class="ppy-switch-enlarge" title="Phóng to">Phóng to</a>
		                    <a class="ppy-switch-compact" title="Đóng">Đóng</a>
		                    <a class="ppy-next" title="Hình sau">Hình sau</a>
		                </div>
		            </div>
		        </div>
	        </div>
		</div>
    	<p class="text">${solution}</p>
    	<div class="howdo">
			<div class="icon"></div>
			<span>${rc.getMessage("page.howidone.tip")}</span> 
		</div>
		<div class="learning">${tip}</div>
		<div class="howdo">
			<div class="icon"></div>
			<span>${rc.getMessage("page.howidone.resources")}</span> 
		</div>
		<div class="learning">${resources}</div>		       
    </div>
    <@commentsPkg componentId=entryId component="DONE_ENTRY" commentCount=commentCount likeCount=likeCount youLikeThis=youLikeThis
				  comments=comments showEditComponent="on" showCommentInput="on" showLikeButton="on" entryOwner=ownerName/>
	</div>
</#macro>